{extend name="index/index" /}
{block name="main"}

<div class="content-page">
    <div class="content">
        <h1>{$title}</h1>

        <table width="800" border="1px solid #ccc">
            <tr>
                <th>id</th>
                <th>权限名</th>
                <th>控制器</th>
                <th>方法</th>
                <th>操作</th>
            </tr>
            {volist name="data" key="k" id="v" }<tr id="permission{$v['id']}">
                <td class="id">{$v['id']}</td>
                <td class="permission">{$v['permission']}</td>
                <td class="controller">{$v['controller']}</td>
                <td class="method">{$v['method']}</td>
                <td>
                    <button  class=" btn btn-danger btn-xs confirmDel " data-target="#confirm" data-toggle="modal" data_id="{$v['id']}">删除</button>
                    <button  class=" btn btn btn-info btn-xs edit" data-toggle="modal" data-target="#myModal" data_id="{$v['id']}">编辑</button>

                </td>
            </tr>
            {/volist}
        </table>
    </div>
</div>
<!--删除的模态框-->
<div class="modal fade hidd bs-example-modal-sm" id="confirm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">删除权限</h4>
            </div>
            <div class="checkbox" id="permission" style="">
                <p>您确定删除么?</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary del" data_id=" "  data-dismiss="modal">确定</button>
            </div>
        </div>
    </div>
</div>
<!-- Modal -->
<div class="modal fade hidd" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel1">权限编辑</h4>
            </div>
            <div class="modal-body">

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button"  onclick="demo()" data-dismiss="modal" class="btn btn-primary tijiao">提交</button>
            </div>
        </div>
    </div>
</div>

<script src="/static/temp/assets/libs/jquery-3.3.1.min.js"></script>
<script>

    $('.confirmDel').click(function () {
        var id=$(this).attr('data_id');
        console.log(id);
        $(".del").attr("data_id",id);
    });


    $('.del').click(function() {
        var pid = $(this).attr('data_id');
        $.ajax({
            method:'get',
            url: '/admin/Permission/del/' + pid,
            dataType: 'json',
            success:function (data) {
               console.log(data);
               var id = data.data["id"];
               // alert(data.data.id);
                $("#permission"+id).remove();
            }
        });

    });


    $('.edit').click(function () {

        var pid = $(this).attr('data_id');
        $.ajax({
            method:'get',
            url: '/admin/Permission/edit/' + pid,
            dataType: 'json',
            success:function (data) {
                $('.modal-body').html('');

                $('.modal-body').append("<input type='hidden' name='id'  value="+data.id+" /><br>权限名 <input type='text' name='permission'  value="+data.permission+" /><br> 控制器 <input type='text' name='controller'  value="+data.controller+" /><br> 操作 <input type='text' name='method'  value="+data.method+" />")
            }
        });

    });

    function demo() {
        var id = $(" input[ name='id' ] ").val();
        var permission = $(" input[ name='permission' ] ").val();
        var controller = $(" input[ name='controller' ] ").val();
        var method = $(" input[ name='method' ] ").val();
        $.ajax({
            method: 'post',
            url: '/admin/permission/doedit',
            datatype: 'json',
            data:{
                'id':id,
                'permission':permission,
                'controller':controller,
                'method':method,
            },
            traditional:true,
            success:function(data){
                $("#permission"+data.id).children(".permission").html(data.permission);
                $("#permission"+data.id).children(".controller").html(data.controller);
                $("#permission"+data.id).children(".method").html(data.method);

            }
        });
    }







</script>

{/block}